<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0 user-scalable=no">
    <title>芳小微宣</title>
    <!-- 引入 WeUI -->
    <link rel="stylesheet" href="http://res.wx.qq.com/open/libs/weui/0.4.0/weui.min.css">
    <link rel="stylesheet" href="css/index.css">
    <script src="js/jquery.min.js"> </script>
    <script src="js/index.js"></script>
    <script src="js/jquery.cookie.js"> </script>
    <script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
    <link rel="stylesheet" href="js/uploaderImage/uploader-image.css"/>
    <script src="js/uploaderImage/Q.js"></script>
    <script src="js/uploaderImage/Q.Uploader.js"></script>
    <script src="js/uploaderImage/Q.Uploader.UI.Image.js"></script>
    <style>
        .weui_cell_ft,.js_counter{
            display: none;
        }
    </style>
</head>
<body ontouchstart>

    <div class="weui_cells_title">最佳读者</div>
    <div class="main imgUpload">
        <div class="upl-int">选择学生</div>
        <div class="selDiv" style="border-top: 0;margin-top: 0;">
            <select class="selSty classMc">
                <option>选择班级</option>
            </select>
            <select class="selSty studentMc">
                <option>选择学生</option>
            </select>
        </div>
        <div class="upl-int">输入内容</div>
        <textarea class="upl-textarea"></textarea>
        <div class="upl-subline"></div>
        <div class="upl-addimg">添加图片</div>
        <div class="content">
            <div class="contentin">
                <div>
                    <a id="upload-target" class="x-button" style=""><img src="images/addPhoto.png" style="width: 100%"></a>
                </div>
                <div id="upload-image-view" class="clearfix"></div>
            </div>
        </div>
        <div id="sidebar" class="sidebar"></div>
    </div>

    <div class="photo_subCon">
        提交
    </div>

    <div class="weui_dialog_alert" style="display: none;">
        <div class="weui_mask"></div>
        <div class="weui_dialog">
            <div class="weui_dialog_hd"> <strong class="weui_dialog_title">警告</strong>
            </div>
            <div class="weui_dialog_bd">弹窗内容，告知当前页面信息等</div>
            <div class="weui_dialog_ft">
                <a href="javascript:;" class="weui_btn_dialog primary">确定</a>
            </div>
        </div>
    </div>
<script>
    $(function(){
        $.ajax({
            type : "POST",
            url : path + "/api/weixin/getClassBySchool?token=" + window.localStorage.getItem("token"),
            data : {},
            dataType : 'json',
            async : true,
            success : function(msg) {
                if(msg.code == 0){
                    var imghtml = "";
                    for(var i=0;i<msg.classList.length;i++){
                        imghtml += '<option value="'+ msg.classList[i].classId +'">'+ msg.classList[i].className +'</option>';
                    }
                    $(".classMc").append(imghtml);
                }else if(msg.code == 501){
                    window.location.href = "login.html";
                }
            }
        });

        $(".classMc").change(function(){
            // 先清空第二个
            $(".studentMc").empty();
            if($(".classMc").find("option:selected").text() == "选择班级"){
                $(".studentMc").append('<option>选择学生</option>');
            }
            $.ajax({
                type : "POST",
                url : path + "/api/weixin/getStudentByClass?token=" + window.localStorage.getItem("token"),
                data : {
                    classId:$(".classMc").val()
                },
                dataType : 'json',
                async : true,
                success : function(msg) {
                    if(msg.code == 0){
                        var imghtml = "";
                        for(var i=0;i<msg.studentList.length;i++){
                            imghtml += '<option value="'+ msg.studentList[i].studentId +'">'+ msg.studentList[i].name +'</option>';
                        }
                        $(".studentMc").append(imghtml);
                    }else if(msg.code == 501){
                        window.location.href = "login.html";
                    }
                }
            });
        });
    })


    $.weui = {};
    $.weui.alert = function(options){
        options = $.extend({title: '提示', text: '提示内容'}, options);
        var $alert = $('.weui_dialog_alert');
        $alert.find('.weui_dialog_title').text(options.title);
        $alert.find('.weui_dialog_bd').text(options.text);
        $alert.on('touchend click', '.weui_btn_dialog', function(){
            $alert.hide();
            return false;
        });
        $alert.show();
    };

    var Uploader = Q.Uploader,
            formatSize = Q.formatSize,
            boxView = document.getElementById("upload-image-view");

    var uploader = new Uploader({
        url: path + "/api/weixin/addBestReadImg?token=" + window.localStorage.getItem('token'),
        target: document.getElementById("upload-target"),
        view: boxView,
        //auto: false,
        upName: "file",
        allows: ".jpg,.png,.gif,.bmp,.jpeg",
        //图片缩放
        scale: {
            //要缩放的图片格式
            types: ".jpg",
            //最大图片大小(width|height)
            maxWidth: 1024
        },
        on: {
            //添加之前触发
            add: function (task) {
                if (task.disabled)
                    return  $.weui.alert({text: "允许上传的文件格式为：" + this.ops.allows});
            },
            //图片预览后触发
            preview: function (data) {
                $("#upload-target").css("display","none");
                console.log(data.task.name + " : " + data.src);
            },
            //图片压缩后触发,如果图片或浏览器不支持压缩,则不触发
            scale: function (data) {
                console.log(data.task.name + " : 已压缩！");
            },
            complete : function(data){
                data.box.lastChild.title =  data.json.url;
            }
        }
    });

    //提交图片
    $(".photo_subCon").click(function(){
        $.ajax({
            type : "POST",
            url : path + "/api/weixin/addBestRead?token=" + window.localStorage.getItem("token"),
            data : {
                className: $(".classMc").find("option:selected").text(),
                studentName: $(".studentMc").find("option:selected").text(),
                remark:$(".upl-textarea").val(),
                img:$(".u-name").attr("title")
            },
            dataType : 'json',
            beforeSend:function(){
                if($(".classMc").find("option:selected").text() == "选择班级"){
                    $.weui.alert({text: "请选择班级！"});
                    return false;
                }else if($(".studentMc").find("option:selected").text() == "选择学生"){
                    $.weui.alert({text: "请选择学生！"});
                    return false;
                }else if(!$(".u-name").attr("title")){
                    $.weui.alert({text: "请添加图片！"});
                    return false;
                }
            },
            success : function(msg) {
                if(msg.code == 0){
                    window.location.href = "readBest.html";
                }else if(msg.code == 501){
                    window.location.href = "login.html";
                }
            }
        });

    });


</script>

</body>
</html>